<template>
	<view>
		<view style="background: url(https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230411/e63bcf73858e37c567847ca55821ddfa.png) no-repeat;background-size: 100%;width: 100%;height: 414rpx;">

		</view>
		<view style="width: 92%;position: absolute;top:10rpx;left: 4%;padding-bottom: 30rpx;">
			<view style="position: relative;">
				<input type="text"   v-model="keywords" class="sou" placeholder-class="suo"
					placeholder="找人/找货/搜信息" confirm-type="search" @confirm="search" />
				<image src="https://dyeego.oss-cn-beijing.aliyuncs.com/uploads/20220325/91243acc628efa1338d3d38826d22484.png"
					class="souicon" mode=""></image>
			</view>

			<view class="" style="width: 100%;margin: 0 auto;display: flex;text-align: center;line-height: 100rpx;">
				<view @click="dibu(1)" style="flex: 1;position: relative;" :class="tabIndex==1?'activea':'aa'">
					帖子
					<image v-if="tabIndex==1" :src="tabLineImg" style="width: 100rpx;height: 12rpx;position: absolute;left: 50%;bottom: 16rpx;transform: translateX(-50%);"  mode=""></image>
				</view>
				<view @click="dibu(2)" style="flex: 1;position: relative;" :class="tabIndex==2?'activea':'aa'">
					新闻
					<image v-if="tabIndex==2" :src="tabLineImg" style="width: 100rpx;height: 12rpx;position: absolute;left: 50%;bottom: 16rpx;transform: translateX(-50%);"  mode=""></image>
				</view>
			</view>
			<view v-if="tabIndex==1">
				<view v-for="(item,index) in list" :key='index' @click="yonghu_xx(item.content.user_id,item.content.type,item.content.firm_id)" style="width: 100%;margin: 20rpx auto;padding: 30rpx;box-sizing: border-box;border-radius:16rpx;background-color: #FFFFFF;">
					<view style="overflow: hidden;">
						<view style="width: 80rpx;height: 80rpx;float: left;margin-right: 30rpx;position: relative;">
							<image :src="item.content.user.avatar" style="width: 80rpx;height: 80rpx;display: block;border-radius: 12upx;overflow: hidden;"
								mode=""></image>
								<!-- vip -->
							<image v-if="item.content.user.is_vip==1 && item.content.type==2"
								src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/ren.png" style="width: 30rpx;height: 30rpx;position: absolute;right: -10rpx;bottom: -10rpx;z-index: 4;"
								mode=""></image>
								<!-- 个人 -->
							<image v-if="item.content.user.is_vip==2 && item.content.type==2"
								src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20220616/ce4d9a4e5c9d814d939dc3324abc44d6.png" style="width: 30rpx;height: 30rpx;position: absolute;right: -10rpx;bottom: -10rpx;z-index: 4;"
								mode=""></image>
								<!-- 企业 -->
							<image v-if="item.content.type==1"
								src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20220616/daf7dad493b169a57961fac90302d9be.png" style="width: 30rpx;height: 30rpx;position: absolute;right: -10rpx;bottom: -10rpx;z-index: 4;"
								mode=""></image>
						</view>
						<view style="width: 82%;float: left;">
							<view style="line-height: 50rpx;overflow: hidden;">
								<text v-if="item.content.user.is_vip==2" style="color: #2B85E4;font-size: 30rpx;display: block;float: left;"
									class="yihang">
									<text v-if="item.content.type==2">
										<text v-if="item.content.user.remark_name!=''">{{item.content.user.remark_name || ''}}</text>
										<text v-if="item.content.user.remark_name!=''" style="margin-left: 10rpx;font-size: 26rpx;">{{item.content.user.name || ''}}</text>
										<text v-if="item.content.user.remark_name==''">{{item.content.user.name || ''}}</text>
									</text>
									<text v-if="item.content.type==1">{{item.content.user.nickname}}</text>
								</text>
								<text v-if="item.content.user.is_vip==1" style="color: #F29100;font-size: 30rpx;display: block;float: left;font-weight: 600;"
									class="yihang">
									<text v-if="item.content.type==2">
										<text v-if="item.content.user.remark_name!=''">{{item.content.user.remark_name || ''}}</text>
										<text v-if="item.content.user.remark_name!=''" style="margin-left: 10rpx;font-size: 26rpx;">{{item.content.user.name || ''}}</text>
										<text v-if="item.content.user.remark_name==''">{{item.content.user.name || ''}}</text>
									</text>
									<text v-if="item.content.type==1">{{item.content.user.nickname}}</text>
								</text>

							<!-- 	<image @click="yonghu_xx(item.user_id)"
									src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/shenfen.png" style="width: 28rpx;height: 22rpx;float: left;margin-top: 14rpx;margin-left: 20rpx;"
									mode=""></image> -->
							</view>
							<!-- 个人 -->
							<view v-if="item.content.type==2" style="line-height: 30rpx;font-size: 24rpx;margin-top: 10rpx;">
								{{item.content.user.company || ''}}
								<text v-if="item.content.user.position!=''" style="margin-left: 20rpx;">{{item.content.user.position || ''}}</text>
							</view>
							<!-- 企业 -->
							<view v-if="item.content.type==1" style="line-height: 30rpx;font-size: 24rpx;margin-top: 10rpx;">
								{{item.content.user.user_nickname || ''}}<text v-if="item.content.user.user_position!=''" style="margin-left: 20rpx;">{{item.content.user.user_position || ''}}</text>

							</view>
							<view style="overflow: hidden;margin-top: 10rpx;">
								<text class="xiao" style="color: red;" v-if="item.is_top==1">置顶</text>
								<text v-if="item.content.tips_manage.length>0" v-for="(a,b) in item.content.tips_manage" :key='b' class="xiao">{{a.name}}</text>
							</view>
							<!-- <view style="height: 30rpx;line-height: 30rpx;color: #999999;font-size: 24rpx;"
								class="yihang">
								{{item.user.company || ''}}
							</view> -->
						</view>
						<!-- <view style="width: 10%;float: left;position: relative;" @click="lahei(item.user_id,index)">
							<text class="iconfont icon-guanbi" style="font-size: 24rpx;position: absolute;top: 20rpx;right: 0;"></text>
						</view> -->
					</view>
					<view @click="tzxq(item.voice_id)" style="color: #000000;font-size: 28rpx;line-height: 40rpx;margin: 16rpx 0 0;">
						<!-- <view class="sanhang">{{item.content.main_content}}</view> -->
						<view class="sihang">
							<text>{{item.content.main_content || ''}}</text>
						</view>
						<view v-if="item.more_check" style="line-height: 40rpx;color: #1fb0ac;font-size: 26rpx;">
							查看更多>
						</view>
					</view>
					<view @click="tzxq(item.voice_id)"  style="overflow: hidden;" class="tu" v-if="item.content.main_images">
						<view v-for="(a,b) in item.content.main_images" :key='index' style="width: 190rpx;height: 190rpx;float: left;border-radius: 16rpx;overflow: hidden;">
							<image :src="a" style="width: 100%;height: 100%;left: 0;" mode="aspectFill"></image>
						</view>

					</view>
					<view @click="tzxq(item.voice_id)" style="overflow: hidden;margin: 20rpx 0 0;">
						<text
							style="color: #999999;font-size: 26rpx;float: left;display: block;width: 280rpx;line-height: 60rpx;">{{item.content.create_time}}</text>
						<view style="float: right;line-height: 60rpx;">
							<image
								src="@/static/index/icon_collect.png"
								style="width: 36rpx;height: 36rpx;float: left;margin-top: 12rpx;margin-right: 6rpx;" mode=""></image>
							<text style="color: #000000;font-size: 24rpx;float: left;margin-right: 14rpx;">
								{{item.content.collect_num>10000?( (item.content.collect_num/10000).toFixed(1)+'万' ):item.content.collect_num || 0}}
							</text>
						</view>
						<view style="float: right;line-height: 60rpx;margin-right: 10rpx;">
							<image
								src="@/static/index/icon_comment.png"
								style="width: 36rpx;height: 36rpx;float: left;margin-top: 12rpx;margin-right: 6rpx;" mode=""></image>
							<text style="color: #000000;font-size: 24rpx;float: left;margin-right: 14rpx;">
								{{item.content.comment_num>10000?( (item.comment_num/10000).toFixed(1)+'万' ):item.content.comment_num || 0}}
							</text>
						</view>
						<view style="float: right;line-height: 60rpx;margin-right: 10rpx;">
							<image
								src="@/static/index/icon_like.png"
								style="width: 36rpx;height: 36rpx;float: left;margin-top: 12rpx;margin-right: 6rpx;" mode=""></image>
							<text style="color: #000000;font-size: 24rpx;float: left;margin-right: 14rpx;">
								{{item.content.like_num>10000?( (item.content.like_num/10000).toFixed(1)+'万' ):item.content.like_num || 0}}
							</text>
						</view>

					</view>

				</view>

				<view style="text-align: center;margin-top: 50rpx;">
					<image v-if="kk" :src="require('@/static/my/no-data.png')" style="width: 334rpx;"  mode="widthFix"></image>
					<view style="width: 80%;margin: 0 auto;">
						<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171' text="暂无数据" v-if="list.length==0"></u-divider>
						<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171' text="没有更多了" v-if="list.length>0 && enmpy"></u-divider>
					</view>
				</view>
			</view>

			<view v-if="tabIndex==2">
				<view style="width:100%;box-sizing: border-box;background-color: #ffffff;border-radius:16rpx 16rpx 0 0 ;margin: 20rpx auto;">
					<view v-for="(item,index) in list" :key='index' @click="xwxq(item.news_id)" style="border-bottom: 1px solid #EEEEEE;padding: 30rpx 30rpx;">
						<view style="color: #000000;font-size: 30rpx;line-height: 80rpx;font-weight: 600;padding-right: 100rpx;" class="yihang">
							{{item.content.transmit_title}}
						</view>
						<view style="overflow: hidden;">
							<view style="width: 60%;float: left;">
								<view style="line-height: 40rpx;color: #666666;font-size: 24rpx;height: 120rpx;" class="sanhang">
									{{item.content.main_text}}
								</view>
								<view style="margin-top: 30rpx;line-height: 30rpx;">
									<!-- <text style="margin-right: 30rpx;float: left;font-size: 24rpx;color: #1fb0ac;">[{{item.category.title}}]</text> -->
									<image src="https://frozen-info.oss-cn-shanghai.aliyuncs.com/uploads/miniapp/liulan.png" style="width: 30rpx;height: 30rpx;float: left;display: block;"  mode=""></image><text style="color: #999999;font-size: 22rpx;float: left;line-height: 30rpx;">{{item.content.view_num}}</text>
									<text style="color: #999999;font-size: 22rpx;float: right;line-height: 30rpx;">{{item.content.create_time}}</text>
									<image src="https://qiniuoss.yjqwl.cn/uploads/20220314/FlrzBNR4GCGHDgjnkg0QKCYv5KRP.png" style="width: 26rpx;height: 26rpx;float: right;display: block;margin-right: 8rpx;margin-top: 2rpx;"  mode=""></image>
								</view>
							</view>
							<view style="width: 40%;float: right;">
								<image :src="item.content.main_image" style="width:220rpx;height: 176rpx;border-radius: 14rpx;float: right;display: block;" mode=""></image>
							</view>
						</view>
					</view>

				</view>
				<view style="text-align: center;margin-top: 50rpx;">
					<image v-if="kk" :src="require('@/static/my/no-data.png')" style="width: 334rpx;"  mode="widthFix"></image>
					<view style="width: 80%;margin: 0 auto;">
						<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171' text="暂无数据" v-if="list.length==0"></u-divider>
						<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171' text="没有更多了" v-if="list.length>0 && enmpy"></u-divider>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				type:1,
				tabIndex:1,
				page:1,
				list:[],
				enmpy:false,
				kk:false,
				keywords:'',
    		tabLineImg: require('@/static/my/tab-line.png')
			}
		},
		// onLoad() {
		// 	this.shoucang()
		// },
		onShow() {
			this.tabIndex=1
			this.page=1
			this.list=[]
			this.kk=false
			this.enmpy=false
			this.shoucang()
		},
		onReachBottom: function() {
			console.log(222222222)
			if (this.enmpy) {
				return
			} else {
				this.shoucang()
			}
		},
		methods:{
			yonghu_xx: function(id,type,f_id) {
				if(type==1){
					uni.navigateTo({

						url:'/subpages/pages/wuliuqiye/wl_qyxq?id='+f_id
					})
				}else{
					uni.navigateTo({

						url:'/fenbao/pages/wenzhang/yhxx?id=' + id
					})
				}
			},
			search:function(){
				this.page=1
				this.list=[]
				this.kk=false
				this.enmpy=false
				this.shoucang()
			},
			tzxq:function(id){
				uni.navigateTo({
					url:'/fenbao/pages/wenzhang/wzxq?id='+id
				})
			},
			xwxq:function(id){
				uni.navigateTo({
					url:'/fenbao/pages/shou/zxxq?id='+id
				})
			},
			dibu:function(index){
				this.tabIndex=index
				this.page=1
				this.list=[]
				this.kk=false
				this.enmpy=false
				this.shoucang()
			},
			shoucang:function(){
				let url
				if(this.tabIndex==1){
					url='api/client/voice_collect'
				}else{
					url='api/client/information_collect'
				}
				let data={
					page:this.page,
					limit:10,
					keywords:this.keywords
				}
				this.post(url,data,true).then(res=>{
					console.log(res)
					if(res.code==1){
						if(this.page==1){
							if (res.data.data== null || res.data.data.length == 0) {
								this.kk = true
								this.enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.enmpy = true
							}
						}else{
							if (res.data.data== null || res.data.data.length == 0) {
								this.enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.enmpy = true
							}
						}

						this.page++
						this.list.push(...res.data.data)
						for(let i=0;i<this.list.length;i++){
							this.list[i].num=!this.list[i].main_content.match(/\n/g)?0:this.list[i].main_content.match(/\n/g).length
							if(this.list[i].num>=4 || this.list[i].main_content.length>=88 || (this.list[i].num==3 && this.list[i].main_content.length>=25) || (this.list[i].num==2 && this.list[i].main_content.length>=46) || (this.list[i].num==1 && this.list[i].main_content.length>=67)){
								this.list[i].more_check=true
							}else{
								this.list[i].more_check=false
							}
						}
					}else{
						this.kk = true
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 1000
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.xiao {
		color: #19BE6B;
		font-size: 20rpx;
		padding: 0rpx 10rpx;
		background: #f3f3f3;
		border-radius: 14rpx;
		display: inline-block;
		height: 30rpx;
		line-height: 30rpx;
		margin-right: 10rpx;
		margin-bottom: 10rpx;
		float: left;
	}
	page{
		background-color: #F8F8F8!important;
		font-family: Demibold;
	}
	.activea{
		font-size: 32rpx;
		color: #FFFFFF;
	}
	.aa{
		color: #f7f7f7;
		font-size: 26rpx;
	}
	.sou {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 40rpx;
		color: #FFFFFF;
		font-size: 26rpx;
		box-sizing: border-box;
		padding: 0 30rpx 0 80rpx;
		background-color: rgba(255,255,255,.3);
	}
	.suo {
		color: #FFFFFF;
		opacity: 1;
		font-size: 26rpx;
	}

	.souicon {
		width: 30rpx;
		height: 30rpx;
		position: absolute;
		top: 50%;
		left: 30rpx;
		transform: translateY(-50%);

	}
	.tu>view {
		margin: 10rpx 0;
	}

	.tu>view:nth-child(3n+2) {
		margin: 10rpx 30rpx;
	}
	.active{
		color: #1fb0ac;
	}
	.a{
		color: #999999;
	}
</style>
